<template>
  <div id="platform-operation">
    <div class="table-content scroll-box">
      <tabBox @tabEmit="tabClick" :tabData="tabData">
      </tabBox>
      
    </div>
  </div>
</template>
<script>
import tabBox from '@/components/tabBox/tabBox.vue';
import until from '@/js/until.js';
import { mapGetters } from 'vuex';

export default {
  data() {
    return {
      tabData: this.getTabData(),
      tablesList: [],
      pn: 1,
      page: 10,
      total: 0,
      keyword: '',
      tabIndex: 0,
    };
  },
  components: {
    tabBox,
  },
  computed: {
    ...mapGetters([
      'getLocale',
    ]),
  },
  created() {
    // this.getList();
  },
  methods: {
    tabClick(data) {
      this.tabIndex = data.tabIndex;
      this.pn = 1;
    },
    getTabData() {
      return [
        {
          text: this.$i18n.tc('views.aboutAd.table1Name1'),
        },
        {
          text: this.$i18n.tc('views.aboutAd.table1Name2'),
        },
        {
          text: this.$i18n.tc('views.aboutAd.table1Name3'),
        },
        {
          text: this.$i18n.tc('views.aboutAd.table1Name5'),
        },
        {
          text: this.$i18n.tc('views.aboutAd.table1Name6'),
        },
        {
          text: this.$i18n.tc('views.aboutAd.table1Name7'),
        },        
        {
          text: this.$i18n.tc('views.aboutAd.table1Name8'),
        },        
      ];      
    },
    changeStart(data) {
      this.start_time = data
    },
    changeEnd(data) {
      this.end_time = data
    },
    postClient() {
      this.pn = 1;
      // if(!((this.start_time && this.end_time) || (!this.start_time && !this.end_time))) {
      //   this.$Message.error(this.$i18n.t('views.giftList.enterStartAndEnd'));
      //   return;
      // }
      const startTime = this.getTimestamp(this.start_time);
      const endTime = this.getTimestamp(this.end_time, 'end');
      if (startTime && endTime && startTime > endTime) {
        this.$Message.error(this.$i18n.t('views.giftList.startEndTime'));
        return;
      }
      this.getList();
    },    
    timestampTime(data) {
      return until.timestampTime(data)
    },
    getList(scrollTopFlag, data = {}) {
      if (data.handleType === 'del') {
        if (this.total - 1 <= this.page * (this.pn - 1)) {
          this.pn = this.pn - 1 <= 0 ? 1 : this.pn - 1;
        }
      }
      return this.$http.giftListByPage({
        page: this.page,
        pn: this.pn,
        keyword: this.keyword.trim(),
        start_time: this.getTimestamp(this.start_time),
        end_time: this.getTimestamp(this.end_time, 'end'),
        is_export: 0,
      }, {
        method: this.getList,
        that: this,
        scrollTopFlag,
      }).then(res => {
        if (res.status === 200) {
          this.tablesList = res.list;
          this.total = res.total;
          return res;
        } else {
          this.$Message.error(res.msg);
        }        
      })
    },
    getTimestamp(time, type) {
      if(typeof time === 'object') return parseInt(time.getTime());
      else return parseInt(until.dataToTimestamp(time, type) / 1000);
    },
  },
  watch: {
    getLocale: function() {
      this.tabData = this.getTabData();
    },
  },  
}
</script>
<style lang="scss" scoped>
  #platform-operation {
    .red-color {
      color: red;
    }
  }
</style>